<script charset="utf-8" src="static/kindeditor-min.js"></script>
<script>
  var editor;
  KindEditor.ready(function(K) {
    editor = K.create('textarea[name="content"]', {
      resizeType : 1,
      cssPath : 'static/pepm.css',
      width:'100%',
      allowPreviewEmoticons : false,
      allowImageUpload : true,
      uploadJson : '/admin/upload',
    });
  });
</script>
<ul class="breadcrumb">
  <li><a href="?/admin/page/">首页</a> <span class="divider">/</span></li>
  <li><a href="?/admin/page/<?=$uper['id']?>/"><?=$uper['title']?></a> </li>
</ul>


<form class="form-horizontal " method="POST" enctype="multipart/form-data">
<!-- 页面左侧 -->
<div class="add_left">
  <div class="seg" style="margin: 5px 0 25px;">
    <div class="seg_title">
      <span>常规信息</span>
    </div>
  </div>
  <div class="control-group">
    <label class="control-label" >页面名称</label>
    <div class="controls">
      <input type="text" name="name" required value="<?=$page['name']?>" >
      <input type="hidden" name="type" value="page" required >
      <input type="hidden" name="upid" value="<?=$page['upid']?>" >
    </div>
  </div>

  <div class="control-group">
    <label class="control-label" >页面标题</label>
    <div class="controls">
      <input type="text" class="input-xxlarge" name="title" value="<?=$page['title']?>" required >
    </div>
  </div>

  <div class="control-group">
    <label class="control-label" >网页内容</label>
    <div class="controls">
      <textarea name="content" rows="20" ><?=htmlspecialchars($page['content'])?></textarea>
    </div>
  </div>
  <!-- 模型参数 -->
  <div class="seg <?=$ext1['model']!='no'?'':'disnone_pro'?>">
    <div class="seg_title">
      <span>模型参数</span>
    </div>
  </div>
  <div class="more_fun_con">
    <!-- 模型菜单 -->
    <div>
      <?php foreach ($model_con as $k => $v) { ?>
        <?php $k = "model_".$k; ?>
        <?php if($v['type']=="text"){ ?>
        <div class="more_pro_con">
          <label class="control-label"><?=$v['name']?></label>
          <div class="controls">
            <input type="text" class="input-xxlarge" name="ext1[<?=$k?>]" value="<?=$ext1[$k]?>">
          </div>
        </div>
        <?php }else if($v['type']=="content"){ ?>
        <div class="more_pro_con">
          <label class="control-label" ><?=$v['name']?></label>
          <div class="controls">
            <textarea name="ext1[<?=$k?>]" style="width: 99%;" ><?=htmlspecialchars($ext1[$k])?></textarea>
          </div>
        </div>
        <?php }else if ($v['type']=="extension") {?>
        <div class="more_pro_con" style="padding-top: 20px;"> 
          <label class="control-label" ><?=$v['name']?></label>
          <div class="controls">
            <textarea name="ext1[<?=$k?>]" style="width: 99%;" ><?=htmlspecialchars($ext1[$k])?></textarea>
          </div>
        </div>
        <?php }else if ($v['type']=="file") {?>
        <div class="more_pro_con" style="padding-top: 20px;"> 
          <label class="control-label" ><?=$v['name']?></label>
          <div class="controls">
            <!-- <input type="file"  class="ehdel_upload" name="<?=$k?>"> -->
            <div class="file" id="file1_<?=$k?>">
              <input type="file" name="<?=$k?>" value="请选择图片">
              <div class="fileerrorTip1_<?=$k?>" id="<?=$k?>_name"><?=$ext1[$k]['name']?></div>
              <div class="showFileName1_<?=$k?>"></div>
            </div>
            <script type="text/javascript">
              $("#file1_<?=$k?>").on("change","input[type='file']",function(){
                var filePath=$(this).val();
                console.log(filePath);
                       $(".fileerrorTip1_<?=$k?>").html("").hide();
                       var arr=filePath.split('\\');
                       var fileName=arr[arr.length-1];
                       $(".showFileName1_<?=$k?>").html(fileName);
               });
            </script>
            <div class="image_box <?=$ext1[$k]['name']==''?'disnone_pro':''?>" style="margin-top: 15px;" id="<?=$k?>">
            <input type="hidden"  name="ext1[<?=$k?>][name]" value="<?=$ext1[$k]['name']?>">
            <input type="hidden"  name="ext1[<?=$k?>][url]" value="<?=$ext1[$k]['url']?>">
            <img src="<?=$ext1[$k]['url']?>" style="padding-top: 15px">
            <a href="javascript:delImage('<?=$page["id"]?>','<?=$k?>','<?=$page["sid"]?>');" style="position: absolute;"><img src="/static/close.png" style=" width:15px; height:15px;position:relative; z-index:2; top:-8px;right:8px;"></a>
            </div>
          </div>
        </div>
        <?php } ?>
      <?php } ?>
    </div>
  </div>
  <script type="text/javascript">
    function delImage(id,model,sid){
      $.post('/?/admin/delimage/'+id+'/'+model+'/'+sid,function(data){
          $('#'+model).remove();
          $('#'+model+"_name").remove();
      });
    }
  </script>

  
  <div class="form-actions">
    <button type="submit" class="btn btn-primary">确认提交</button>
  </div>
</div>
<!-- 页面右侧 -->
<div class="add_right">
  <!-- seo设置 -->
  <div class="right_box">
    <div class="seg" style="margin-top: 4px;margin-bottom: 25px;">
      <div class="seg_title">
        <span>seo设置</span>
      </div>
    </div>
    <?foreach($exts as $ext=> $label ){?>
    <div class="control-group">
      <label class="control-label" ><?=$label?></label>
      <div class="controls">
        <input type="text" class="input-xxlarge" name="ext1[<?=$ext?>]" value="<?=$ext1[$ext]?>" />
      </div>
    </div>
    <?}?>
  </div>
  <!-- 高级功能选择 -->
  <div class="right_box">
    <div class="seg" style="margin-top: 4px;margin-bottom: 25px;">
      <div class="seg_title">
        <span>高级功能</span>
      </div>
    </div>
    <div class="more_fun_con  disnone">
      <div class="control-group">
        <label class="control-label" >风格文件：</label>
        <div class="controls">
          <select type="text" class="input-xxlarge input_select" name="ext1[template]"  >
            <option></option>
            <?foreach($templates as $template){?>
            <option  <?=$ext1['template']==$template['id']?'selected':''?> value="<?=$template['id']  ?>" ><?=$template['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" >排版文件：</label>
        <div class="controls">
          <select type="text" class="input-xxlarge input_select" name="ext1[layout]"  >
            <option></option>
            <?foreach($layouts as $layout){?>
            <option  <?=$ext1['layout']==$layout['id']?'selected':''?> value="<?=$layout['id']  ?>" ><?=$layout['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" >页面类型：</label>
        <div class="controls">
          <select type="text" id="more_son" class="input-xxlarge input_select" name="ext1[type]" onchange="func_son(this.id)">
            <option></option>
            <option  <?=$ext1['type']=='form'?'selected':''?> value="form" >页面</option>
            <option  <?=$ext1['type']=='list'?'selected':''?> value="list" >目录</option>
          </select>
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" >原型选择：</label>
        <div class="controls">
          <select type="text" id="more_pro" data-type="page" data-upid="<?=$mod['upid']?>" data-url="<?=$mod['url']?>" class="input-xxlarge input_select" name="ext1[model]" onchange="func_gro(this.id)">
            <option value="no">不使用</option>
            <?foreach($models as $model){?>
            <option  <?=$ext1['model']==$model['id']?'selected':''?> value="<?=$model['id']  ?>" ><?=$model['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
    </div>
  </div>
  <!-- 子页面设置 -->
  <div class="right_box right_box_son <?=$ext1['type']=='list'?'':'disnone_son'?>">
    <div class="seg" style="margin-top: 4px;margin-bottom: 25px;">
      <div class="seg_title">
        <span>子页面设置</span>
      </div>
    </div>
    <div class="son_function">
      <div class="son_title"><p>子页面默认设置</p></div>
      <div class="son_number">
        <p>每页显示：<input type="" name="ext1[son_number]" value="<?=$ext1['son_number']?>" style="width: 15%">&nbsp;条</p>
      </div>
      <div class="son_template son_select">
        <label class="control-label" >子页面风格文件：</label>
        <div class="controls">
          <select type="text" class="input-xxlarge input_son_select" name="ext1[son_template]">
            <option></option>
            <?foreach($templates as $son_template){?>
            <option  <?=$ext1['son_template']==$son_template['id']?'selected':''?> value="<?=$son_template['id']  ?>" ><?=$son_template['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
      <div class="son_layout son_select">
        <label class="control-label" >子页面排版文件：</label>
        <div class="controls">
          <select type="text" class="input-xxlarge input_son_select" name="ext1[son_layout]">
            <option></option>
            <?foreach($layouts as $son_layout){?>
            <option  <?=$ext1['son_layout']==$son_layout['id']?'selected':''?> value="<?=$son_layout['id']  ?>" ><?=$son_layout['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
      <div class="son_pro son_select">
        <label class="control-label" >子页面原型选择：</label>
        <div class="controls">
          <select type="text" class="input-xxlarge input_son_select" name="ext1[son_model]"  >
            <option></option>
            <?foreach($models as $son_model){?>
            <option  <?=$ext1['son_model']==$son_model['id']?'selected':''?> value="<?=$son_model['id']  ?>" ><?=$son_model['name']?></option>
            <?}?>
          </select>
        </div>
      </div>
    </div>
  </div>
</div>
</form>

<style type="text/css">
  .add_left{
    width: 70%;
    float: left;
    padding-right: 5%;
  }
  .right_box{
    width: 20%;
    height: 200px;
    margin-right: 5%;
    float: right;
  }
  .input-xxlarge{
    width: 100%;
  }
  .input_select{
    width: 60% !important;
  }
  .input_son_select{
    width: 45% !important;
  }
  
  .disnone_pro,.disnone_son{
    display: none;
  }
  .more_function{
    margin: 20px 0 20px 0;
  }
  .more_function a{
    background-color: #ccc;
    border-radius: 4px;
    border: 1px solid #828282;
  }
  .form-actions{
    text-align: center;
  }
  .control-label{
    float: left;
  }
  .form-actions{
    margin: 100px 0 100px 0;
  }
  .son_select , .more_fun_con > .control-group{
    margin: 10px;
  }
  .son_function{
    background-color: #e5e5e5;
    padding-bottom: 1px;
    padding-top: 1px;
    border: 1px solid #828282;
    margin-bottom: 7px;
  }
  .son_title{
    margin-left: 10px;
  }
  .son_number{
    margin-left: 10px;
  }
  .seg{
    max-width: 1024px;  
    margin-top: 40px;  
    margin-bottom: 25px;
  } 
  .seg_title{
    height: 1px;
    border-top: 1px solid #ddd;
    text-align: center;
  }
  .seg_title span{
    position: relative;
    top: -12px;
    background: #fff;
    padding: 0 20px;
    font-size: 20px;
  }
  .file {
    position: relative;
    margin-left: 5%;
    width: 30%;
    min-height: 21px;
    background: #D0EEFF;
    border: 1px solid #99D3F5;
    border-radius: 4px;
    padding: 4px 12px;
    overflow: hidden;
    color: #1E88C7;
    text-decoration: none;
    text-indent: 0;
    line-height: 20px;
  }
  .file input {
      position: absolute;
      font-size: 100px;
      right: 0;
      top: 0;
      opacity: 0;
  }
  .file:hover {
      background: #AADFFD;
      border-color: #78C3F3;
      color: #004974;
      text-decoration: none;
  }
</style>
<script type="text/javascript">
  function aClick () {
     $(".disnone").removeClass("disnone");
  }
  function func_son(a){
    var y=document.getElementById(a).value;
    if(y=="list"){
      $(".right_box_son").removeClass("disnone_son");
    }else if(y=="form"){
      $(".right_box_son").addClass("disnone_son");
    }
  }
  function func_gro(a){
    var y=document.getElementById(a);
    if(y!=""){
      window.location.href = "?/admin/"+y.dataset.type+"/"+y.dataset.url+"/"+y.dataset.upid+"/"+y.value;
    }
  }
  $("#file1").on("change","input[type='file']",function(){
    var filePath=$(this).val();
    var a = $(this).dataset.type;
    console.log(a);
           $(".fileerrorTip1").html("").hide();
           var arr=filePath.split('\\');
           var fileName=arr[arr.length-1];
           $(".showFileName1").html(fileName);
   });
</script>
  
